/* eslint-disable no-console */
import React from 'react';

import { Button, ButtonVariants, Snackbar } from '@/shared/ui';
import { useSnackbar } from 'notistack';

import { ReactComponent as LikeFullIcon } from '../icons/like-full-icon.svg';
import { ReactComponent as LikeIcon } from '../icons/like-icon.svg';
import cs from './AddToFavourite.module.scss';

export const AddToFavourite = <T,>({
  handleAdd,
  handleDelete,
  isLoading,
  isFavourite,
  successMessage,
  errorMessage,
  isHidden,
}: {
  handleAdd: (...args: any) => Promise<T>;
  handleDelete: (...args: any) => Promise<T>;
  isLoading?: boolean;
  isFavourite?: boolean;
  successMessage: { onAdd: string; onDelete: string };
  errorMessage: { onAdd: string; onDelete: string };
  isHidden?: boolean;
}) => {
  const { enqueueSnackbar } = useSnackbar();

  const handleClick = async () => {
    if (isHidden) {
      return;
    }
    if (isFavourite) {
      handleDelete()
        .then(() => {
          enqueueSnackbar(successMessage.onDelete, {
            variant: 'success',
            content: (key, message) => <Snackbar id={key} message={message} size="md" variant="success" />,
          });
        })
        .catch((error) => {
          console.error(errorMessage.onDelete, error);
        });
      return;
    }

    handleAdd()
      .then(() => {
        enqueueSnackbar(successMessage.onAdd, {
          variant: 'success',
          content: (key, message) => <Snackbar id={key} message={message} size="md" variant="success" />,
        });
      })
      .catch((error) => console.error(errorMessage.onAdd, error));
  };
  if (isHidden) return <></>;
  return (
    <Button
      className={cs.like_button}
      data-testid="button-toggle_favourite"
      disabled={isLoading}
      onClick={() => handleClick()}
      variant={ButtonVariants.Icon}
    >
      {isFavourite ? <LikeFullIcon /> : <LikeIcon />}
    </Button>
  );
};
